Using Google Fonts in Roll20 Character Sheets

Web Fonts in Roll20
Voiced by Amazon Polly

A little video of how to use Google fonts in Roll20 character sheets! This feature was announced on February 18, and is pretty exciting, but some folks may not know how to use it.

  1. Go to fonts.google.com and find a font you want.
  2. Click the Select Font icon in the upper right corner of the font.
  3. You can select more than one font. If you want multiple fonts, you should select them all at once.
  4. Click the Selected Fonts menu in the bottom right and click “Import” to get the code.
  5. Copy the code between the <script> tags. Make sure you’re using the “css2” version of the URL.
  6. Open your character sheet’s CSS file in a text editor.
  7. Paste the code at the top of the CSS sheet.
    You can only have one @import line in your css sheet!
  8. Change the font-family for any classes used in your character sheet to use the web font.
  9. Save your CSS.
  10. Upload it to the Custom Sheet Sandbox or to your game to test it out.
  11. If you’re contributing your sheet to the community sheets, commit it via github.